<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width = device-width, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no"/>
<title>股票查询</title>
</head>
<body>
<style>
*{margin:0;padding:0;}
</style>

<div>输入股票/名称/代码进行查询</div>
<input type="text" id="sina_stk_input" placeholder="股票/名称/代码">
<div id="list_stk"></div>

<script src="wsj-get-sina-stock.js"></script>

<script>
var currentRequestId = 0
var osina_stk_input = document.getElementById('sina_stk_input')
var olist_stk = document.getElementById('list_stk')

osina_stk_input.addEventListener('input', function () {
  var requestId = ++currentRequestId//防止多次点击时,请求顺序不一致导致的数据错乱
  var _code = this.value
  //输入框没有字符时的逻辑
  if (!_code) {
    olist_stk.innerHTML = ''
    return
  }

  getSinaStk(_code, function (data) {
    if (requestId == currentRequestId) {
      //这里开始写你的代码
      if (data.length) {
        console.info('有股票', data)
        //回调函数返回的data是个数组,数组里有对象,对象形如{code: "000725", symbol: "sz000725", name: "京东方A"}
        var str = ''
        data.forEach(function (v, k) {
          str += v.code + ' ' + v.name + ' ' + v.symbol + '<br>'
        })
        olist_stk.innerHTML = str
      } else {
        console.info('没有查询到股票', data)
        olist_stk.innerHTML = '没有查询到股票'
      }
    }else{
      console.log('不一致,丢弃', requestId, currentRequestId)
    }
  }, 'all')
})
</script>
</body>
</html>
